﻿//载入基础页面
{extend name="common/base" /}

//页面单独CSS
{block name="CustomCSS"}

{/block}

//页面单独JS
{block name="CustomJS"}
<script src="__STATIC__/vendors/js/validation/validation.min.js"></script>
<script src="__STATIC__/vendors/js/jquery.form/jquery.form.min.js"></script>
<script src="__STATIC__/vendors/js/noty/noty.min.js"></script>
<script src="__STATIC__/vendors/js/daterangepicker/moment.min.js"></script>
<script src="__STATIC__/vendors/js/daterangepicker/daterangepicker.js"></script>
<script type="text/javascript">

    //获取配置信息，如传入值，则赋值
    function getConfig(config){
        //组装URL
        var url = "{:url('Car/carConfigJson',['vehicle'=>''])}"+$("#vehicle").val();
        //使用replace方法把url里面的+号给替换掉
        url = url.replace(/\+/g, '%2B');
        //请求数据
        $.ajax({
            //请求方式
            type : "GET",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : url,
            //请求成功
            success : function(config_data) {
                // var config_data = $.parseJSON(result);
                //删除市的原有option
                $('#config').empty();
                $('<option></option>').appendTo('#config');
                //添加option
                $.each(config_data, function(index,item) {
                    $('<option value="' + item + '">' + item + '</option>').appendTo('#config');
                });
                if(config){
                    $('#config').val(config);
                }
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                console.log(e.status);
                console.log(e.responseText);
            }
        });
    }

    //获取配置信息
    function getInfo(){
        //组装URL
        var url = "{:url('Car/carInfoJson')}?vehicle="+$("#vehicle").val()+"&config="+$("#config").val();
        //使用replace方法把url里面的+号给替换掉
        url = url.replace(/\+/g, '%2B');
        //请求数据
        $.ajax({
            //请求方式
            type : "GET",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : url,
            //请求成功
            success : function(info_data) {
                // var info_data = $.parseJSON(result);
                //删除市的原有option，给color赋值
                $('#color').empty();
                $('<option></option>').appendTo('#color');
                //添加option
                $.each(info_data.color, function(index,item) {
                    $('<option value="' + item + '">' + item + '</option>').appendTo('#color');
                });
                $('#color').val('');
                //删除的原有option，给trim赋值
                $('#trim').empty();
                $('<option></option>').appendTo('#trim');
                //添加option
                $.each(info_data.trim, function(index,item) {
                    $('<option value="' + item + '">' + item + '</option>').appendTo('#trim');
                });
                $('#trim').val('');

                //price赋值
                $('#price').val(info_data.price);
                //model赋值
                $('#model').val(info_data.model);
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                alert('数据有误，请联系管理员');
                console.log(e.status);
                console.log(e.responseText);
            }
        });
        $('#vin').empty();
        $('<option value="">暂时没有匹配车辆</option>').appendTo('#vin');
    }

    //车辆匹配查询
    function queryStock(){
        var vehicle = $("#vehicle").val();
        var config = $("#config").val();
        var color = $("#color").val();
        var trim = $("#trim").val();
        var url = '{:url('Stock/query')}?vehicle=' + vehicle + '&config=' + config +'&color=' + color + '&trim=' + trim;
        url = url.replace(/\+/g, '%2B');
        $.ajax({
            //请求方式
            type : "GET",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : url,
            //请求成功
            success : function(car_data) {
                // var car_data = $.parseJSON(result);
                if(car_data.length != 0){
                    //删除的原有option，给color赋值
                    $('#vin').empty();
                    $('<option value="">有车辆匹配，请选择车辆</option>').appendTo('#vin');
                    //添加option
                    $.each(car_data, function(index,item) {
                        var option = item.option == null?'无':item.option;
                        $('<option value="' + item.vin + '">' + '车架号:' + item.vin + ' 选装:' + option + '</option>').appendTo('#vin');
                    });
                }else{
                    //删除的原有option，给color赋值
                    $('#vin').empty();
                    $('<option value="">暂时没有匹配车辆</option>').appendTo('#vin');
                }
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                alert('数据有误，请联系管理员');
                console.log(e.status);
                console.log(e.responseText);
            }
        });
    }

    $(document).ready(function () {

        //single date
        $('#create_date').daterangepicker({
            singleDatePicker: true,
            autoUpdateInput: false,
            locale: {
                format:'YYYY-MM-DD',
            }
        },function(start,end) {
            this.autoUpdateInput = true//选完日期后打开自动赋值
        });
        
        $("#ajaxForm").ajaxForm({
            //请求方式
            type : "GET",
            //定义返回JSON数据，还包括xml和script格式
            dataType: 'json',
            //在发送之前进行的操作，如果有问题，返回false即可不会进行提交
            beforeSend: function () {
                //定义 form为当前表格
                const form = $("#ajaxForm")

                //如果没有完成校验就返回false不提交
                if (form[0].checkValidity() === false){
                    return false;
                }
            },
            success: function (data) {
                //提交成功后调用
                new Noty({
                    type: "success",
                    layout: "topRight",
                    text: "成功修改一条数据，ID为" + data,
                    progressBar: true,
                    timeout: 2500,
                    animation: {
                        open: "animated bounceInRight",
                        close: "animated bounceOutRight"
                    },
                    callbacks: {
                        afterShow: function() {
                            $(location).attr('href', '{:url('Order/undelivered')}');
                        },
                    }
                }).show();
                return false;
            },
            error: function(XmlHttpRequest, textStatus, errorThrown){  
                //提交成功后调用
                new Noty({
                    type: "error",
                    layout: "topRight",
                    text: "数据修改失败",
                    progressBar: true,
                    timeout: 2500,
                    animation: {
                        open: "animated bounceInRight",
                        close: "animated bounceOutRight"
                    }
                }).show();
                return false;
            } 
        });

        //如果车系有变化，拉取配置信息
        $("#vehicle").change(function(){
            getConfig();
            $('#color').empty();
            $('<option>请先选择配置</option>').appendTo('#color');
            $('#trim').empty();
            $('<option>请先选择配置</option>').appendTo('#trim');
        });

        //如果车系有变化，拉取配置信息，清除匹配车辆信息
        $("#config").change(function(){
            getInfo();
        });

        //如果颜色有变化，拉取配置信息
        $("#color").change(function(){
            queryStock();
        });

        //如果内饰有变化，拉取配置信息
        $("#trim").change(function(){
            queryStock();
        });
    });

 
</script>
{/block}

//页面显示名称
{block name="PageName"}
修改订单信息
{/block}

//主页面代码
{block name="main"}
<div class="row">
    <div class="col-xl-12">
        <div class="widget has-shadow">
            <div class="widget-header bordered no-actions d-flex align-items-center">
                <h2>修改订单信息</h2>
            </div>
            <div class="widget-body">
                <form class="needs-validation" novalidate="" id="ajaxForm" action="{:url('Order/update',['id' => $data.id])}">
                    <div class="form-group row mb-5">
                        <label class="col-xl-3 form-control-label">基本信息</label>
                        <div class="col-xl-9">
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">下单时间*</span>
                                        <input type="text" class="form-control" placeholder="请输入下单时间" required="required" name="create_date" id="create_date" value="{notempty name="data.create_date"}{$data.create_date|date='Y-m-d'}{/notempty}">
                                        <div class="invalid-feedback">
                                            请输入下单时间
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">销售顾问*</span>
                                        <input type="text" class="form-control" placeholder="请输入销售顾问信息" required="required" name="sales" id="sales" list="salesList" value="{notempty name="data.sales"}{$data.sales}{/notempty}">
                                        <datalist id="salesList">
                                            {volist name="sales" id="sales"}
                                                {notempty name="sales"}<option value="{$sales}">{/notempty}
                                            {/volist}
                                        </datalist>
                                        <div class="invalid-feedback">
                                            请输入销售顾问名称
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row  mb-5">
                        <label class="col-xl-3 form-control-label">客户信息</label>
                        <div class="col-xl-9">
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">客户名称*</span>
                                        <input type="text" class="form-control" placeholder="请输入客户名称" required="required" name="name" value="{notempty name="data.name"}{$data.name}{/notempty}">
                                        <div class="invalid-feedback">
                                            请输入客户名称
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">联系电话</span>
                                        <input type="phone" class="form-control" placeholder="请输入联系电话" name="phone" value="{notempty name="data.phone"}{$data.phone}{/notempty}">
                                        <div class="invalid-feedback">
                                            请输入联系电话
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row  mb-5">
                        <label class="col-xl-3 form-control-label">车辆信息</label>
                        <div class="col-xl-9">
                              <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">车系*</span>
                                        <select class="form-control" name="vehicle" id="vehicle" required="required">
                                            <option></option>
                                            {volist name="vehicleOption" id="vehicleOption"}
                                                {notempty name="vehicleOption"}
                                                    <option value="{$vehicleOption}" 
                                                        {if $data.vehicle == $vehicleOption}selected{/if}>{$vehicleOption}
                                                    </option>
                                                {/notempty}
                                            {/volist}
                                        </select>
                                         <div class="invalid-feedback">
                                            请选择车系
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">配置*</span>
                                        <select class="form-control" name="config" id="config" required="required">
                                            <option></option>
                                            {volist name="configOption" id="configOption"}
                                                {notempty name="configOption"}
                                                    <option value="{$configOption}"
                                                        {if $data.config == $configOption}selected{/if}>{$configOption}
                                                    </option>
                                                {/notempty}
                                            {/volist}
                                        </select>
                                        <div class="invalid-feedback">
                                            请选择配置
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">颜色*</span>
                                        <select class="form-control" name="color" id="color" required="required">
                                            <option></option>
                                            {volist name="colorOption" id="colorOption"}
                                                {notempty name="colorOption"}
                                                    <option value="{$colorOption}"{if $data.color == $colorOption}selected{/if}>{$colorOption}</option>
                                                {/notempty}
                                            {/volist}
                                        </select>
                                         <div class="invalid-feedback">
                                            请选择颜色
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">内饰*</span>
                                        <select class="form-control" name="trim" id="trim" required="required">
                                            <option></option>
                                            {volist name="trimOption" id="trimOption"}
                                                {notempty name="trimOption"}
                                                    <option value="{$trimOption}"{if $data.trim == $trimOption}selected{/if}>{$trimOption}</option>
                                                {/notempty}
                                            {/volist}
                                        </select>
                                        <div class="invalid-feedback">
                                            请选择内饰
                                            </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">指导价*</span>
                                        <input class="form-control" type="text" name="price" id="price" required="required" readonly="readonly" value="{notempty name="data.price"}{$data.price}{/notempty}">
                                        <div class="invalid-feedback">
                                            请填写车型指导价
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">车型编码*</span>
                                        <input class="form-control" type="text" name="model" id="model" required="required" readonly="readonly" value="{notempty name="data.model"}{$data.model}{/notempty}">
                                        <div class="invalid-feedback">
                                            请填写车型编码
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">选装*</span>
                                        <input class="form-control" type="text" name="option" id="option" value="{notempty name="data.option"}{$data.option}{/notempty}" >
                                        <div class="invalid-feedback">
                                            请填写车辆选装
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row  mb-5">
                        <label class="col-xl-3 form-control-label">配车信息</label>
                        <div class="col-xl-9">
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">车架号*</span>
                                        <select class="form-control"  name="vin" id="vin">
                                            {empty name = "stockOption"}
                                                <option value="">暂时没有匹配车辆</option>
                                            {/empty}
                                            {notempty name="stockOption"}
                                                <option></option>
                                                {volist name="stockOption" id="stockOption"}
                                                <option value="{$stockOption.vin}"{if $data.vin == $stockOption.vin}selected{/if}>{$stockOption.vin} 选装:{if $stockOption.option != ""}{$stockOption.option}{else}无{/if}</option>
                                                {/volist}
                                            {/notempty}
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row  mb-5">
                        <label class="col-xl-3 form-control-label">成交信息</label>
                        <div class="col-xl-9">
                            <div class="form-group row">
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">成交价*</span>
                                        <input type="number" class="form-control" placeholder="请输入成交价" required="required" name="finalprice" value="{notempty name="data.finalprice"}{$data.finalprice}{/notempty}" >
                                        <div class="invalid-feedback">
                                            请输入成交价
                                        </div>
                                    </div>
                                </div>
                                <div class="col">
                                    <div class="input-group">
                                        <span class="input-group-addon addon-primary">定金</span>
                                        <input type="number" class="form-control" placeholder="请输入定金" name="frontmoney" required="required"  value="{notempty name="data.frontmoney"}{$data.frontmoney}{/notempty}">
                                        <div class="invalid-feedback">
                                            请输入定金
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="text-right">
                        <button class="btn btn-shadow" type="reset" onclick="history.go(-1);">取消</button>
                        <button class="btn btn-gradient-01" type="submit">提交</button>
                    </div>
                </form>
            </div>
        </div>
        <!-- End Export -->
    </div>
</div>
{/block}//主页面
